{extend name="index/public" /}

{block name="content"}
<form class="layui-form" action="" id="searchBox">
    <div class="layui-inline">
        <div class="layui-input-inline">
            {MyTag:game type='manage' /}
        </div>
    </div>
    <div class="layui-inline">
        <div class="layui-input-inline">
            {MyTag:channel type='manage' /}
        </div>
    </div>
    <div class="layui-inline">
        <input type="text" name="date" value="{$date}" id="date" lay-verify="datetime" placeholder="申请时间" autocomplete="off" class="layui-input">
    </div>
    <div class="layui-inline">
        <input type="text" name="role_name" value="" id="role_name" placeholder="角色名称" autocomplete="off" class="layui-input">
    </div>
    <div class="layui-inline">
        <input type="text" name="role_id" value="" id="role_id" placeholder="角色ID" autocomplete="off" class="layui-input">
    </div>
    <div class="layui-inline">
        <select name="status" id="status" lay-filter="status">
            <option value="">全部（状态）</option>
            {foreach $Think.config.channel_rebate_status as $k=>$v}
            <option value="{$k}">{$v}</option>
            {/foreach}
        </select>
    </div>
    <div class="layui-inline">
        <select name="admin_id" id="admin_id" lay-filter="admin_id">
            <option value="">全部（操作员）</option>
            {volist name="admin_id" id="vo"}
            <option value="{$vo.id}">{$vo.remark}</option>
            {/volist}
        </select>
    </div>

    <div class="layui-inline">
        <button class="layui-btn searchBtn my-btn my-btn-sm" type="button">搜索</button>
    </div>
</form>

<table id="tableBox" lay-filter="tableBox"></table>

<script type="text/html" id="statusTpl">
    {{#  if(d.status === '未查看'){ }}
    <span class="layui-bg-orange status0" val="{{ d.id }}" style="padding: 4px 6px;">{{ d.status }}</span>
    {{#  } else if(d.status === '已收录') { }}
    <span class="layui-bg-blue status1" val="{{ d.id }}" style="padding: 4px 6px;">{{ d.status }}</span>
    {{#  } else if(d.status === '已发放') { }}
    <span class="layui-bg-green status2" val="{{ d.id }}" style="padding: 4px 6px;">{{ d.status }}</span>
    {{#  } else if(d.status === '被驳回') { }}
    <span class="status3" val="{{ d.id }}" style="padding: 4px 6px;background: #777;color:#fff;">{{ d.status }}</span>
    {{#  } }}
</script>

<script type="text/html" id="tableBar">
    {{# if(d.status == '未查看'){ }}
    <button class="receive layui-btn my-btn layui-btn-sm" lay-event="receive">收录</button>
    <button class="finish layui-btn layui-btn-sm layui-btn-disabled" disabled="" lay-event="finish">发放</button>
    <button class="reject layui-btn my-btn layui-btn-sm" lay-event="reject">驳回</button>
    {{#  }else if(d.status == '已收录'){ }}
    <button class="receive layui-btn layui-btn-sm layui-btn-disabled" disabled="" lay-event="receive">收录</button>
    <button class="finish layui-btn my-btn layui-btn-sm" lay-event="finish">发放</button>
    <button class="reject layui-btn my-btn layui-btn-sm" lay-event="reject">驳回</button>
    {{#  }else if(d.status == '已发放'){ }}
    <button class="receive layui-btn layui-btn-sm layui-btn-disabled" disabled="" lay-event="receive">收录</button>
    <button class="finish layui-btn layui-btn-sm layui-btn-disabled" disabled="" lay-event="finish">发放</button>
    <button class="reject layui-btn layui-btn-sm layui-btn-disabled" disabled="" lay-event="reject">驳回</button>
    {{#  }else if(d.status == '被驳回'){ }}
    <button class="receive layui-btn layui-btn-sm layui-btn-disabled" disabled="" lay-event="receive">收录</button>
    <button class="finish layui-btn layui-btn-sm layui-btn-disabled" disabled="" lay-event="finish">发放</button>
    <button class="reject layui-btn layui-btn-sm layui-btn-disabled" disabled="" lay-event="reject">驳回</button>
    {{#  } }}
</script>

<script type="text/html" id="channelTpl">
    <div style="border-bottom: 1px solid #ddd; height:32px; line-height: 32px;">
        {{ d.cps_id }}
    </div>
    <div>
        {{ d.channel_id }}
    </div>
</script>
<script type="text/html" id="roleTpl">
    <div style="border-bottom: 1px solid #ddd; height:32px; line-height: 32px;">
        {{ d.role_name }}
    </div>
    <div>
        {{ d.role_id }}
    </div>
</script>
{/block}

{block name="css"}
<style>
    table {border-collapse: separate;}
    .layui-table-cell {height: 62px; line-height:62px; padding-left: 10px; padding-right: 10px;}
    td[data-field=cps_id] > div {line-height: 28px;}
    td[data-field=role_id] > div {line-height: 28px;}
    thead .layui-table-cell {line-height: 28px; height: 28px;}
</style>
{/block}

{block name="js"}
<script>
    layui.use(['table', 'laydate'], function(){
        var table = layui.table
            ,$ = layui.$
            ,form = layui.form
            ,load = null
            ,laydate = layui.laydate
            ,active = {
                reload: function () {
                    var channel_id = $('#channel_id').val()
                        ,game_id= $('#game_id').val()
                        ,status = $('#status').val()
                        ,date = $('#date').val()
                        ,admin_id = $('#admin_id').val()
                        ,role_id = $('#role_id').val()
                        ,role_name = $('#role_name').val();

                    table.reload('tableId', {
                        page: {curr: 1}
                        ,where: {channel_id:channel_id,game_id:game_id,status:status,date:date,admin_id:admin_id,role_id:role_id,role_name:role_name}
                        ,height: 'full-100'
                    })
                },
            };

        //日期
        laydate.render({
            elem: '#date'
            ,type: 'date'
            ,range: true
            ,calendar: true
            ,min: '2016-01-01'
            ,max: 0
        });

        //表格初始化
        table.render({
            elem: '#tableBox'
            ,height: 'full-100'
            ,url: '{:url("RebateChannel/index")}'
            ,page: true
            ,limit:20
            ,limits:[20,40,60,80]
            ,loading:true
            ,id:'tableId'
            ,done: function (res, curr, count) {
                layer.close(load);
                $('#layui-loading').hide();
            }
            ,cols: [[
                {field:'apply_time', title: '申请时间', width: 150}
                ,{field:'cps_id', title: '渠道名称', width: 150, templet: '#channelTpl'}
                ,{field:'game_id', title: '游戏名称', width: 150}
                ,{field:'server_name', title: '所在区服', width: 140}
                ,{field:'role_id', title: '角色名称', width: 160, templet: '#roleTpl'}
                ,{field:'pay_money', title: '充值金额', width: 120, style:'background-color: #6495ed; color: #fff;'}
                ,{field:'pay_time', title: '充值时间', width: 100}
                ,{field:'pay_id', title: '订单号', width: 200}
                ,{field:'remark', title: '备注', width: 200}
                ,{field:'message', title: '发放留言', width: 200}
                ,{field:'reason', title: '驳回原因', width: 200}
                ,{field:'admin_id', title: '操作员', width: 150}
                ,{field:'finish_time', title: '发放时间', width: 150}
                ,{field:'status', title: '状态', width:120, templet: '#statusTpl', fixed: 'right'}
                ,{title: '操作', align:'center', width: 250, toolbar:'#tableBar', fixed: 'right'}
            ]]
        });

        //监听工具条
        table.on('tool(tableBox)', function(obj){
            var data = obj.data,
                thisObj = $(this);

            if(obj.event === 'receive'){
                layer.confirm('确定要收录吗？', {offset: '250px'}, function(index){
                    var load = layer.load();
                    $.post('{:url("RebateChannel/receive")}',{id: data.id}, function(json){
                        layer.close(load);
                        if(json.code==0){
                            obj.update({
                                status: json.data
                            });
                            thisObj.addClass('layui-btn-disabled').attr('disabled', true).removeClass('my-btn').siblings('.finish').removeClass('layui-btn-disabled').attr('disabled', false).addClass('my-btn');
                            layer.msg(json.msg, {icon: 1, time:3000})
                        }else{
                            layer.msg(json.msg, {icon: 0, time:3000});
                        }
                    }, 'JSON').error(function(){
                        layer.close(load);
                        layer.msg('连接超时，请联系后台管理员', {icon: 2, time:3000});
                    });
                });
            }else if(obj.event === 'finish'){
                layer.prompt({
                    formType: 2,
                    value: ' ',
                    title: '请输入发放留言',
                    offset: '100px',
                    area: ['600px', '300px'] //自定义文本域宽高
                }, function(value, index, elem){
                    var load = layer.load();
                    $.post('{:url("RebateChannel/finish")}',{id: data.id, message: value}, function(json){
                        layer.close(load);
                        if(json.code==0){
                            obj.update({
                                status: json.data.status,
                                message: json.data.message
                            });
                            thisObj.addClass('layui-btn-disabled').attr('disabled', true).removeClass('my-btn').siblings('.reject').addClass('layui-btn-disabled').attr('disabled', true).removeClass('my-btn');
                            layer.msg(json.msg, {icon: 1, time:3000})
                        }else{
                            layer.msg(json.msg, {icon: 0, time:3000});
                        }
                    }, 'JSON').error(function(){
                        layer.close(load);
                        layer.msg('连接超时，请联系后台管理员', {icon: 2, time:3000});
                    });

                    layer.close(index);
                });
            }else if(obj.event === 'reject'){
                layer.prompt({
                    formType: 2,
                    value: '',
                    title: '请输入驳回原因',
                    offset: '100px',
                    area: ['600px', '300px'] //自定义文本域宽高
                }, function(value, index, elem){
                    var load = layer.load();
                    $.post('{:url("RebateChannel/reject")}',{id: data.id, reason: value}, function(json){
                        layer.close(load);
                        if(json.code==0){
                            obj.update({
                                status: json.data.status,
                                reason: json.data.reason
                            });
                            thisObj.addClass('layui-btn-disabled').attr('disabled', true).removeClass('my-btn').siblings('.receive, .finish').addClass('layui-btn-disabled').attr('disabled', true).removeClass('my-btn');
                            layer.msg(json.msg, {icon: 1, time:3000})
                        }else{
                            layer.msg(json.msg, {icon: 0, time:3000});
                        }
                    }, 'JSON').error(function(){
                        layer.close(load);
                        layer.msg('连接超时，请联系后台管理员', {icon: 2, time:3000});
                    });

                    layer.close(index);
                });
            }

        });

        //监听搜索下拉菜单
        $('#searchBox .searchBtn').click(function(){
            load = layer.load();
            active['reload'].call(this);
            return false;
        })
    });
</script>
{/block}